<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/js/swiper.js"></script>
		<link rel="stylesheet" type="text/css" href="css/subway.css" />
		<style type="text/css">
			#left {
				height: 100px;
				width: 580px;
				border-radius: 10px;
				border: 1px solid darkgray;
				background-color: rgb(57, 153, 76);
			}
			
			#left>span {
				font-size: 18px;
				color: papayawhip;
				font-weight: bold;
			}
			
			#left>a {
				color: #FFFFFF;
				font-size: 15px;
			}
			
			#drop_menu {
				margin-left: 50px;
			}
			
			.tt>img {
				width: 590px;
				height: 350px;
				border-radius: 20px;
				margin-top: 30px;
				margin-left: -5px;
			}
			
			#dow {
				margin-top: 450px;
			}
			
			#ul1 {
				width: 200px;
				height: 450px;
				list-style: none;
				margin-top: -100px;
				margin-left: 100px;
			}
			
			#ul1>li>a {
				color: rgb(127, 198, 91);
				line-height: 38px;
				font-weight: bold;
				font-size: 15px;
			}
			#ul1>li>ul{
				width: 200px;
				list-style: none;
				margin-left: 0px;
				margin-top: 20px;
				font-size: 8px;
			}
			#dow{
				padding-top: 100px;
			}
			#bgg{
	border: 2px solid slateblue;
	width: 800px;
	height: 550px;
}
		</style>
	</head>

	<body>

		<div id="overall">
			<header>
				<!--最上部文字-->
				<div id="language">
					<span class="span1">中国</span>
					<select id="Sele">
						<option selected="selected" value="">Select Language</option>
						<option value="EN">English</option>
						<option value="CN">Chinese</option>
					</select>
					<span class="span1">|</span>
					<a href="http://www.subway.com/en-us">进入全球官网</a>
				</div>
				<!--菜单栏-->
				<div id="logo">
					<img src="img/QQ20170408-0.jpg" />
					<div class=" vitta1"></div>
					<div class=" vitta2"></div>
					<ul class="theUl">
						<li>
							<a href="###">新闻动态</a>
						</li>
						<li>
							<a href="###" id="top">美食与营养</a>
						</li>
						<li>
							<a href="###">加盟流程</a>
						</li>
						<li>
							<a href="###">关于我们</a>
						</li>
						<li id="theli">
							<a href="###">快餐店位置查询</a>
						</li>
					</ul>
				</div>
				<!--全效果下拉菜单-->
				<ul id="drop_menu" class="drop-menu">
					<li>
						<a>超值 Value </a>
					</li>
					<li>
						<a>经典 Classics</a>
					</li>
					<li>
						<a>精选 Premium</a>
					</li>
					<li>
						<a>低脂 Low Fat</a>
					</li>
					<li>
						<a>百味卷 Warp</a>
					</li>
					<li>
						<a>沙拉 Salad</a>
					</li>
					<li>
						<a>聚餐服务 Catering</a>
					</li>
					<li>
						<a>饮料和小食 Drinks & Sides</a>
					</li>
					<li>
						<a>早餐 Breakfast</a>
					</li>
					<li>
						<a>营养 Nutrition</a>
					</li>
					<li>
						<a>如何点餐 How To Order</a>
					</li>
				</ul>
			</header>
			
			<div id="bgg">
			<!--左侧文字和图片-->
			<div id="left">
				<span>如何点餐</span><br />
				<a>SUBWAY®赛百味快餐店推出多款不同口味的三明治、沙拉和配菜，供您选择。为了确保您每次用餐称心如意，我们总结出最科学的点餐方式。此方法包含多个步骤，但非常简单。如下所示：</a>
				<div class="tt">
					<img src="img/12.png" />
				</div>
				
			</div>
			<!--右侧菜单栏-->
			<div id="right">
				<ul id="ul1">
					<li>
						<a>超值 Value ></a>
						<hr />
						<ul>
							<li>
							 ▶ 意大利香辣 Spicy Ltalian
							</li>
							<li>
							 ▶ 培根 B.L.T
							</li>
							<li>
							 ▶ 火腿 Ham
							</li>
							<li>
							 ▶ 新鲜蔬菜Veggie Delite
							</li>
						</ul>
					</li>
					<li>
						<a>经典C lassics</a>
						<hr />
					</li>
					<li>
						<a>精选 Premium</a>
						<hr />
					</li>
					<li>
						<a>低脂 Low Fat</a>
						<hr />
					</li>
					<li>
						<a>百味卷 Wrap</a>
						<hr />
					</li>
					<li>
						<a>沙拉 Salad</a>
						<hr />
					</li>
					<li>
						<a>聚餐服务 Catering</a>
						<hr />
					</li>
					<li>
						<a>饮料喝小食 Drinks * Sides</a>
						<hr />
					</li>
					<li>
						<a>早餐 BREAKFAST</a>
						<hr />
					</li>
					<li>
						<a>营养 Nutrition</a>
						<hr />
					</li>
					<li>
						<a>如何点餐 How To Order</a>
						<hr />
					</li>
				</ul>
			</div>
			</div>
			<!--下侧图标-->
			<div id="dow">
				<div class="dowLeft">
					<a href="###"><img src="img/photo/首页_files/home-box-1_CN.jpg" /></a>
					<a href="###"><img src="img/photo/首页_files/home-box-2_CN.jpg" /></a>
					<a href="###"><img src="img/photo/首页_files/home-box-3_CN.jpg" /></a>
				</div>
				<!--右侧图片-->
				<div id="dowRight">
					<a href="###"><img src="img/photo/首页_files/weibo_CN.jpg"/></a>
					<a href="###"><img src="img/photo/首页_files/weixin_CN.jpg" id="weixin" /></a>
				</div>
				
					<img src="img/photo/首页_files/code.png" id="barcode2D"/>
				
			</div>
			<!--尾部标签-->
			<p id="b-top">
					<a href="###">主页</a>丨
					<a href="###">菜单/营养</a> 丨
					<a href="###">如何加盟 </a> 丨
					<a href="###">关于我们</a> 丨
					<a href="###">快餐店位置查询</a> 
					<br />
					<a href="###">联系我们</a> 丨
					<a href="###"> 使用条款</a> 丨
					<a href="###">隐私权政策</a> 丨
					<a href="###">SUBWAY Partners™</a>
				</p>
				<p id="b-bottom">
					SUBWAY® is a Registered Trademark of Subway IP Inc.
					<br /> ®2016 Subway IP Inc.
				</p>
		</div>

		<script>
			var Top = document.getElementById("top");
			var dorp_menu = document.getElementById("drop_menu");
			//菜单子列表显现隐藏
			Top.onmouseover = function() {
				drop_menu.style.display = "block";
			}
			drop_menu.onmousemove = function() {
				drop_menu.style.display = "block";
			}
			drop_menu.onmouseout = function() {
				drop_menu.style.display = "none";
			}
		</script>
	</body>

</html>